在之前的文章中，我們反覆認知到變數就是將我們需要用到的資料儲存起來；而我們接下來要認識的函式，則是幫助我們預先將某項工作所需要的執行步驟先儲存起來，當有需要時就可要求函式執行這些步驟。

函式的意義

函式的用途在於，如果需要做重複性很高的動作，可以把這個動作設計成一組程式碼。通常在做比較大型的應用時，都會切成好幾個函式，例如：一個函式用來新增、一個函式用來刪除……。這樣程式碼就會變得比較精簡。我認為函式可以理解成自己設計的公式組合，裡面可以代入參數，以達到特定目的或答案。

相較於一般程式碼是由上到下依序讀取，函式則會被解譯器優先讀取，也就是說，就算先呼叫函式名稱再宣告函式內容，依然可以正常執行，這就是所謂的提升（hoisting）。

函式的寫法

基本組合：宣告函式 + 函式名稱

function greet(){
  alert('歡迎光臨！');
  alert('請問你要點些什麼？');
}

函式名稱後面有小括號，裡面可以帶入參數。大括號裡放的則是你希望函式做的動作。寫好之後並不會執行，需要執行該函式時，只要呼叫它就可以了。呼叫方式如下：
greet();

上面這種經過宣告而成立的函式稱為命名函式，必須經過呼叫才會執行；而還有另一種函式叫做匿名函式，顧名思義，是不用取名字的，而且位置要放在我們期望它執行的地方，解譯器執行到這一行的時候才會執行，因此也無法另外呼叫它。

//點擊按鈕觸發匿名函式
document.getElementById('按鈕 id 名').onclick = function(){
  alert('你好');
}

全域變數與區域變數

乍看之下「變數」不應該放在函式篇，但是以下要談的東西必須搭配函式的概念才比較好理解。讓我們來了解一下全域與區域變數的意涵。

• 區域變數：寫在函式內的變數稱為區域變數，只在函式內有效，當函式執行完以後就結束了，所以當我們在函式的外面再去查詢的時候是查不到變數值的。
• 全域變數：寫在函式之外稱為全域變數，會被記憶在 window 物件中（window 物件是什麼之後會提到），但是記憶體會越來越肥，所以還是比較推薦使用區域變數。

如何在函式外讀取區域變數值

如果要在函式外把區域變數撈出來，只要在函式外宣告一個空值的全域變數，而函式內不需再另外宣告變數。之後，呼叫函式，再用 console.log(變數名)，就查得出值了。

// 宣告一個空值全域變數
var total;
function count(num,price){
  // 不需再次宣告，直接賦值
  total = num * price;  
}
// 記得要先執行函式才讀得到函式內的變數值
count(8,10);
// 查詢，可以查到 total 為 80
console.log(total);

因為區域變數只有在這個函式內才被賦予意義（值），函式結束後值就消滅，所以如果在函式內外同時進行宣告，那在函式外查詢變數的話依然是空值喔。
所以只需要在函式外宣告一次變數，函式內的程式碼發現內部沒有變數宣告時，就會自己去找外面是否有變數宣告，如此一來，之後就可以在函式外查得到變數值了。

關於函式的基本觀念在本篇大致講完了，下一篇要講的是如何實際用函式執行功能。